<template>
	<view class="home">
		<view class="search-input u-flex-y-center u-flex-between">
			<u-input placeholder="搜索你想要的" v-model="params.keywords" border="none"></u-input>
			<u-image src="/static/images/icon_ss.png" width="76rpx" @click="_childOrderList(1)" height="48rpx"></u-image>
		</view>
		<component :is="infoItem" type="2" :list="data.list"></component>
	</view>
</template>
<script setup>
	import { onMounted, ref } from "vue";
	import infoItem from '@/components/info-item/info-item.vue'
	import { childOrderList } from "../../config/api";
	import { onReachBottom,onShow } from '@dcloudio/uni-app'
	const props = defineProps({
		id: ''
	})
	const data = ref({
		list: []
	});
	const params = ref({
		page: 1
	})
	onShow(() => {
		_childOrderList(1)
	})
	onReachBottom(() => {
		params.value.page++
		_childOrderList(params.value.page)
	})
	const _childOrderList = (page) => {
		if(page)		params.value.page = page
		childOrderList({
			order_id: props.id,
			page: params.value.page
		}).then(res => {
			console.log(res)
			if(params.value.page == 1)	data.value.list = res.data.data
			else data.value.list = [...data.value.list,...res.data.data]
		})
	}
</script>
<style scoped lang="scss">
	.home {
		padding: 20rpx 26rpx;
		min-height: 100vh;
		background-color: #FAFAFA;
	}

	.search-input {
		padding: 12rpx 20rpx;
		background: #fff;
		border-radius: 12rpx;
	}
</style>